import React, { Component } from 'react';
import {connect} from 'react-redux';
import {setLogin} from '@/store/actions';

import Dialog from '@/components/Dialog';
import Form from '@/components/Form';
import fetchJSON from '@/utils/fetch';

class Login extends Component {
  constructor (...args) {
    super(...args);
  }
  async login () {
    let form = this.refs.form1.getFormData();
    // console.log(form.get('password'));
    try {
      await fetchJSON('admin/login', {
        method: 'POST',
        body: form
      });
      // alert('登录成功');
      // console.log(data);
      // 登录成功，修改登录状态
      this.props.setLogin(true);
      localStorage.login = true;
      this.props.history.push('/');
    } catch (e) {
      alert('登录失败' + e)
    }
  }
  render() {
    return (
      <div>
        <Dialog title="登录" shadow={false} close_btn={false}>
          <Form
            ref="form1"
            fields={
              [
                {
                  name: 'username',
                  type: 'text',
                  label: '用户名',
                  placeholder: '请输入用户名'
                },
                {
                  name: 'password',
                  type: 'password',
                  label: '密　码',
                  placeholder: '请输入密码'
                }
              ]
            }
            btns={
              [
                {
                  text: '登录',
                  type: 'primary',
                  onClick: this.login.bind(this)
                }
              ]
            }
          ></Form>
        </Dialog>
      </div>
    );
  }

}

export default connect((state, props) => Object.assign({}, props, state), {
  setLogin
})(Login);
